<template>
  <a-card :bordered='false'>
    <div style='width: 400px;height: 300px;'>
      <a-spin :spinning='confirmLoading'>
        <a-form-model ref='form' :model='model'>

          <a-form-model-item :labelCol='labelCol' :wrapperCol='wrapperCol' prop='period' label='结账日期'>
            <a-input placeholder='请输入结账日期' v-model='model.settleTime' />
          </a-form-model-item>
          <a-form-model-item :labelCol='labelCol' :wrapperCol='wrapperCol' prop='settleTime' label='账期'>
            <a-month-picker format='YYYYMM' valueFormat='YYYYMM' v-model='model.period' />
          </a-form-model-item>
          <a-form-model-item :labelCol='labelCol' :wrapperCol='wrapperCol' prop='state' label='账期开关'>
            <a-radio-group v-model='model.state' @change='stateChange'>
              <a-radio v-for='(item,index) in stateList' :key='item.value' :value='item.value'>{{ item.text }}</a-radio>
            </a-radio-group>
          </a-form-model-item>

        </a-form-model>
        <div style='float: right'>
          <a-button type='primary' :loading="saveLoading" @click='save'>保存</a-button>
        </div>
      </a-spin>
    </div>
  </a-card>
</template>

<script>
import '@/assets/less/TableExpand.less'
import {
  getFlowerAccountPeriodSwitch,
  addFlowerAccountPeriodSwitch,
  editFlowerAccountPeriodSwitch
} from '../../api/api'
import { ifInteger } from '../../utils/ifNumber'
import moment from 'moment'

export default {
  name: 'FlowerAccountPeriodSwitchList',
  data() {
    return {
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },

      confirmLoading: false,
      stateList: [
        {
          value: 0,
          text: '关闭'
        }, {
          value: 1,
          text: '打开'
        }
      ],
      flag:-1,//是否新增的标识（0为新增）
      saveLoading:false
    }
  },
  computed: {
    importExcelUrl: function() {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
    }
  },
  mounted() {
    this.queryFlowerAccountPeriodSwitch()
  },
  methods: {
    queryFlowerAccountPeriodSwitch() {// 获取已保存的账期
      getFlowerAccountPeriodSwitch().then(res => {
        if (res.success) {
          if (res.result.records.length!==0){
            this.model=res.result.records[0]
          }else {
            this.flag=0
          }
        }else {
          this.$message.error(res.message)
        }
      })
    },
    save() {// 编辑出库单
      if (this.model.settleTime === undefined || this.model.settleTime === '' || this.model.settleTime === null) {
        this.$message.error('请输入结账日期')
      } else if (!ifInteger(this.model.settleTime)) {
        this.$message.error('结账日期必须是数字')
      } else if (parseInt(this.model.settleTime) > 31) {
        this.$message.error('结账日期必须小于等于31')
      } else if (this.model.period === undefined || this.model.period === '' || this.model.period === null) {
        this.$message.error('请选择账期')
      } else if (this.model.state === undefined || this.model.state === '' || this.model.state === null) {
        this.$message.error('请选择账期开关')
      } else {
        this.saveLoading=true
        if (this.flag===0){
          addFlowerAccountPeriodSwitch(this.model).then(res => {
            if (res.success) {
              this.model.state=parseInt(this.model.state)
              this.$message.success('保存成功')
            }else {
              this.$message.error(res.message)
            }
            this.saveLoading=false
          })
        }else{
          editFlowerAccountPeriodSwitch(this.model).then(res => {
            if (res.success) {
              this.model.state=parseInt(this.model.state)
              this.$message.success('保存成功')
            }else {
              this.$message.error(res.message)
            }
            this.saveLoading=false
        })
        }
      }
    },
    //账期开关的change
    stateChange(e) {
      this.model.state = e.target.value
    }
  }
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>